<template>
  <input type="text" placeholder="请输入账号" :value="props.modelValue" @input="$emit('update:modelValue',($event.target as HTMLInputElement).value  )" class=" input mt-3">
</template>

<script setup lang="ts">
 const props =defineProps({
   modelValue:String
 }) 
</script>

<style scoped lang="scss">
  .input{
      @apply   border-4 cursor-pointer border  border-x-gray-700 w-full 
              rounded-md   border-gray-500 outline-none placeholder:text-xs 
                  p-1  px-4   ring-violet-600 focus:ring-2 ring-offset-2
                   duration-500 focus:border-white hover:ring-2 hover:border-white
   }
</style>